<!DOCTYPE html>
<html class="no-js fixed-layout">
<!--通用head-->
{include file="Public:head"}

<body>
<!--[if lte IE 9]>
<p class="browsehappy">你正在使用<strong>过时</strong>的浏览器，Amaze UI 暂不支持。 请 <a href="http://browsehappy.com/" target="_blank">升级浏览器</a>
	以获得更好的体验！</p>
<![endif]-->

<!--管理端头部-->
{include file="Public:header"}
<div class="am-cf admin-main">

	<div class="operate1" style="display:none" >
		<h2 class="gaoliang">新增数据：<span style="color: white;float: right;margin-right: 10px;font-weight: bold " class="cancel">X</span></h2>
		<form action="insert" method="post">
			区域：&emsp;&emsp;<input type="text" name="area" value=""><br/>
			最高气温：<input type="text" name="insert_lqw" value=""><br/>
			最低气温：<input type="text" name="insert_sqw" value=""><br/>
			降雨量：&emsp;<input type="text" name="insert_yl" value=""><br/>
			湿度：&emsp;&emsp;<input type="text" name="insert_sd" value=""><br/>
			<button style="width: 80px;margin-left: 320px" id="in_btn">重置</button>
			<input type="submit" value="提交" style="width: 80px;">
		</form>
	</div>
	<div class="operate2" style="display:none">
		<h2 class="gaoliang">修改数据：<span style="color: white;float: right;margin-right: 10px;font-weight: bold " class="cancel1">X</span></h2>
		<form action="update" method="post">
			<input type="text" name="id" id="up_id" value="" style="display:none">
			区域：&emsp;&emsp;<input type="text" value="" name="up_qy" id="up_qy"><br/>
			最高气温：<input type="text" value="" name="up_lqw" id="up_lqw"><br/>
			最低气温：<input type="text" value="" name="up_sqw" id="up_sqw"><br/>
			降雨量：&emsp;<input type="text" value=""  name="up_yl" id="up_yl"><br/>
			湿度：&emsp;&emsp;<input type="text" name="up_sd" value="" id="up_sd"><br/>
			<button style="width: 80px;margin-left: 320px" id="up_btn">重置</button>
			<input type="submit" value="提交" style="width: 80px;">
		</form>
	</div>




	<!--管理端左菜单栏-->
	{include file="Public:menu"}


		<!-- content start -->
		<div class="admin-content">
			<div class="admin-content-body">
				<div class="am-cf am-padding">
					<div class="am-fl am-cf "><span class="am-icon-location-arrow am-vertical-align-middle" style="color: gray;">&nbsp;负荷预测<samll>>></samll>日气象信息</span></div>
					<div class="am-fr am-cf am-btn-group">
						<button type="button" class="am-btn am-btn-primary app-bor-btn insert">新增</button>
						<button type="button" class="am-btn am-btn-primary app-bor-btn updata">修改</button>
						<button type="button" class="am-btn am-btn-primary app-bor-btn delete">删除</button>
					</div>
				</div>

				<div class="am-g">
					<div class="am-u-lg-12">
						<div class="am-panel am-panel-default ">
							<div class="app-titlebar ">
								<samll class="am-vertical-align-middle">区域</samll>
								<input type="text" name="" value="" id="area1"/>&emsp;
								<samll class="am-vertical-align-middle">开始时间</samll>
								<div class="input-time">
									<input type="text" placeholder="年/月/日" data-am-datepicker readonly required  id="date1"/>
									<span class="am-icon-calendar input-time-icon"></span>
								</div>&emsp;
								<samll class="am-vertical-align-middle">结束时间</samll>
								<div class="input-time">
									<input type="text" placeholder="年/月/日" data-am-datepicker readonly required id="date2" />
									<!--<span class="am-icon-calendar input-time-icon"></span>-->
								</div>&emsp;
								<a href="" class="am-link-muted"><u>重置</u></a>
								<button type="button" class="am-btn am-btn-danger am-radius am-fr select">查询</button>
							</div>

							<table class="am-table">
								<thead style="background-color: #eee;">
								<tr>
									<td><input type="checkbox" class="all" /></td>
									<td>区域</td>
									<td>时间</td>
									<td>平均温度(℃)</td>
									<td>最高温度(℃)</td>
									<td>最低温度(℃)</td>
									<td>降雨量(毫米)</td>
									<td>平均湿度(%RH)</td>
								</tr>
								</thead>
								<tbody class="content">
								{volist name="result" id="list"}
								<tr>
									<td><input class="id" type="checkbox"  id="{$list.id	}"/></td>
									<td>{$list.area}</td>
									<td>{$list.date}</td>
									<td>{$list.max_temperature/2+$list.min_temperature/2}</td>
									<td>{$list.max_temperature}</td>
									<td>{$list.min_temperature}</td>
									<td>{$list.rainfull}</td>
									<td>{$list.humidity}</td>
								</tr>
								{/volist}
								</tbody>
							</table>

						</div>

					</div  >
					<div class="am-box" style="display:inline-block"></div>

				</div>
				<div class="am-padding pageli">
					{$result->render()}
				</div>
			</div>

			<footer class="admin-content-footer">
				<hr>
				<p class="am-padding-left">© 2014 AllMobilize, Inc. Licensed under MIT license.</p>
			</footer>
		</div>
		<!-- content end -->
	</div>


	<a href="#" class="am-icon-btn am-icon-th-list am-show-sm-only admin-menu" data-am-offcanvas="{target: '#admin-offcanvas'}"></a>

	<!--[if lt IE 9]>
	<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
	<script src="http://cdn.staticfile.org/modernizr/2.8.3/modernizr.js"></script>
	<script src="__PUBLIC__static/js/amazeui.ie8polyfill.min.js"></script>
	<script src="__PUBLIC__static/js/bootstrap.js" type="text/javascript" charset="utf-8"></script>
	<![endif]-->

	<!--[if (gte IE 9)|!(IE)]><!-->
	<script src="__PUBLIC__static/js/jquery.min.js"></script>
	<!--<![endif]-->
	<script src="__PUBLIC__static/js/amazeui.min.js"></script>

	<script src="__PUBLIC__static/js/highcharts.js" type="text/javascript" charset="utf-8"></script>
	<script src="__PUBLIC__static/js/app.js" type="text/javascript" charset="utf-8"></script>
	<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js" charset="utf-8"></script>
	<script type="text/javascript">
        //点击全选，再点击全不选
        $i=0;
        $(".all").on("click",function(){


            $i++;
            console.log($i)
            if($i>1){
                $i=0;
                $(".id").prop("checked",false);
            }else{
                $(".id").prop("checked",true);
            }
        })


        //点击删除操作产生相应事件
        $(".delete").on("click",function(){


            //1、拿到当前显示页面上的所有ID值
            $s=$(".id");
            //2、遍历ID数组，取出选中状态的ID值
            var arr = new Array();
            $.each($s,function(i,v){
                if($s[i].checked==true){
                    arr.push($s[i].id);
                }
            })
            console.log(arr);
            if(arr=="")return false;
            $con=confirm("删除请谨慎，确认删除？");
            if($con==false)return  false;
            //将选中的ID值通过发送一个请求传递到后台接口去
            $.ajax({
                type:"post",
                url:"delete",
                data:{'arr':arr},
                dataType:'json',
                success:function(data) {

                    alert("删除成功！");
                    location.reload();   //刷新当前界面。
                }
            })

        })
        //点击新增操作产生相应事件
        $(".cancel").on("click",function(){
            $(".updata").attr("disabled",false);
            $(".operate1").css("display","none");
        })
        $(".insert").on("click",function(){
            $(".updata").attr("disabled","disabled");
            $(".operate1").css("display","block");
        })
        //点击修改操作产生相应事件
        $(".cancel1").on("click",function(){
            $(".insert").attr("disabled",false);
            $(".operate2").css("display","none");
        })

        $(".updata").on("click",function(){
            $(".insert").attr("disabled","disabled");
            $(".operate2").css("display","block");

            $s=$(".id");
            var arr = new Array();
            $.each($s,function(i,v){
                if($s[i].checked==true){
                    arr.push($s[i].id);
                }
            })
            //取数组第一个为显示的id
            $id=arr[0];
            $.ajax({
                type:"post",
                url:"find",   //数据传输的控制器方法
                data: { "id":$id,
                },
                dataType:'json',
                success:function(data) {
                    $("#up_id").val(data.id);
                    $("#up_qy").val(data.area);
                    $("#up_lqw").val(data.max_temperature);
                    $("#up_sqw").val(data.min_temperature);
                    $("#up_yl").val(data.rainfull);
                    $("#up_sd").val(data.humidity);
                }
            });
        })
        $("#up_btn").on("click",function(){
            $("#up_id").val("");
            $("#up_qy").val("");
            $("#up_lqw").val("");
            $("#up_sqw").val("");
            $("#up_yl").val("");
            $("#up_sd").val("");
            return false;
        })
        $(".select").on("click",function(){

            function a($data){
                var f = $data.split(' ', 2);
                var d = (f[0] ? f[0] : '').split('-', 3);
                var t = (f[1] ? f[1] : '').split(':', 3);
                return(new Date(
                    parseInt(d[0], 10) || null,
                    (parseInt(d[1], 10) || 1) - 1,
                    parseInt(d[2], 10) || null,
                    parseInt(t[0], 10) || null,
                    parseInt(t[1], 10) || null,
                    parseInt(t[2], 10) || null
                )).getTime() / 1000;
            }
            $date1=$("#date1").val();
            $date2=$("#date2").val();
            $one=a($date1);
            $two=a($date2);
            $area1=$("#area1").val();

            if($one>$two){
                alert("查询的起始日期不能大于或等于终止日期");
                location.reload();
            }else if($area1==""){
                alert("查询的地址不能为空");
                location.reload();
            }
            $.ajax({
                type:"post",
                url:"select",   //数据传输的控制器方法
                data: { "date1":$date1,
                    "date2":$date2,
                    "area1":$area1
                },
                dataType:'json',
                success:function(data){

                    $(".content").html("");
                    for(var i = 0; i < data.length; i++) {
                        var tr='<tr><td><input type="checkbox" id="'+data[i].id+'"/></td>';
                        tr+='<td>'+ data[i].area+'</td>';
                        tr+='<td>'+ data[i].date+'</td>';
                        tr+='<td>'+(((data[i].max_temperature-0)+(data[i].min_temperature-0))/2)+'</td>';
                        tr+='<td>'+ data[i].max_temperature+'</td>';
                        tr+='<td>'+ data[i].min_temperature+'</td>';
                        tr+='<td>'+ data[i].rainfull+'</td>';
                        tr+='<td>'+ data[i].humidity+'</td></tr>';
                        //追加上去
                        $(".content").append(tr);
                    }
                }
            });

        })

	</script>
</html>